<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>无缝轮播图</title>
    <link rel="stylesheet" href="case04.css">
    <style>
      body{
          background-color: #F3EFE0;
      }
      .bot{
          color: #918E84;
          font-family:Arial, Helvetica, sans-serif;
          font-size: 24px;
          position: relative;
          right: 200px;
          float: right;
      }
      a{
          text-decoration: none;
          color: #918E84;
          font-family: Arial, Helvetica, sans-serif;
      }
    </style>
  </head>
  <body>
    <div class="banner">
      <ul class="hot">
        <!--轮播图片-->
        <li><a href="#"><img src="images/1.jpg" ></a></li>
        <li><a href="#"><img src="images/2.jpg" ></a></li>
        <li><a href="#"><img src="images/3.jpg" ></a></li>
        <li><a href="#"><img src="images/4.jpg" ></a></li>
        <li><a href="#"><img src="images/5.jpg" ></a></li>
      </ul>
      <!--小圆点-->
      <ul class="dot"><li class="on"></li><li></li><li></li><li></li><li></li></ul>
      <!-- 左右翻页箭头-->
      <div class="arrow"><span class="prev">&lt;</span><span class="next">&gt;</span></div>
    </div>
    <div class="bot">
      <a href="../章节目录/第十一章.html">返回</a>
      <br><br>
      <h3>Please appreciate((●'◡'●))......</h3>
    </div>
    <script src="jquery-1.12.4.min.js"></script>
    <script src="case04.js"></script>
  </body>
</html>